<div>
  <nz-collapseset>
    <nz-collapse [nzTitle]="panels.name" [nzActive]="panels.active" [nzDisabled]="panels.disabled">
      <form nz-form>
        <div nz-form-item nz-row style="margin-bottom: 12px">
          <div nz-form-label nz-col  [nzSpan]="2">
            <label>计划名称</label>
          </div>
          <div nz-form-control nz-col [nzSpan]="3">
            <nz-input [(ngModel)]="trainingPlanBean.planName" name="planName">
            </nz-input>
          </div>
          <div nz-form-label nz-col [nzSpan]="2">
            <label>计划类型</label>
          </div>
          <div nz-form-control nz-col [nzSpan]="3">
            <nz-select nzAllowClear [(ngModel)]="trainingPlanBean.planType"  name="planType" [nzPlaceHolder]="'请选择'" [nzSize]="'large'" [nzShowSearch]="true">
              <nz-option *ngFor="let item of config.TRAINING_TYPE" [nzLabel]="item.label" [nzValue]="item.value"></nz-option>
            </nz-select>
          </div>

          <div nz-form-label nz-col [nzSpan]="2">
            <label>实施时间</label>
          </div>
          <div nz-form-control nz-col [nzSpan]="7" >
            <nz-datepicker [nzSize]="'large'" [nzFormat]="'YYYY-MM-DD'" name="startDate" [nzPlaceHolder]="'开始日期'" [(ngModel)]="trainingPlanBean.startDate"></nz-datepicker>
            至
            <nz-datepicker [nzSize]="'large'" [nzFormat]="'YYYY-MM-DD'" name="endDate" [nzPlaceHolder]="'结束日期'" [(ngModel)]="trainingPlanBean.endDate"></nz-datepicker>
          </div>

          <button [nzSize]="'large'" nz-button  [nzType]="'primary'" (click)="query()">查询</button>
        </div>
      </form>
    </nz-collapse>
  </nz-collapseset>

  <ul nz-menu [nzMode]="'horizontal'">
    <li *ngIf="partyType=='4' ||partyType=='2'" nz-menu-item (click)="add(title, content, footer)">
      <i class="anticon anticon-plus"></i>添加</li>
    <li *ngIf="partyType=='4'||partyType=='2'" nz-menu-item (click)="update(title, content, footer)">
      <i class="anticon anticon-copy"></i>详情\修改</li>
    <li *ngIf="partyType=='4'||partyType=='2'" nz-menu-item (click)="delete()">
      <i class="anticon anticon-delete"></i>删除</li>
  </ul>

  <nz-table #nzTable [nzDataSource]="dataList" nzSize="middle" [nzBordered]="true" [nzIsPagination]="false" (nzDataChange)="displayDataChange($event)">
    <thead nz-thead>
    <tr>
      <th nz-th [nzCheckbox]="true">
        <label nz-checkbox [(ngModel)]="allChecked" [nzIndeterminate]="indeterminate" (ngModelChange)="checkAll($event)">
        </label>
      </th>
      <th nz-th>
        <span>计划名称</span>
      </th>
      <th nz-th>
        <span>计划类型</span>
      </th>
      <th nz-th>
        <span>培训内容描述</span>
      </th>
      <th nz-th>
        <span>负责人</span>
      </th>
      <th nz-th>
        <span>计划实施时间</span>
      </th>
      <th nz-th>
        <span>培训材料</span>
      </th>
      <th nz-th>
        <span>培训签到表</span>
      </th>
      <th nz-th>
        <span>培训试卷</span>
      </th>
      <th nz-th>
        <span>考核汇总表</span>
      </th>
      <th nz-th>
        <span>计划表</span>
      </th>

    </tr>
    </thead>
    <tbody nz-tbody>
    <tr nz-tbody-tr *ngFor="let data of dataList">
      <td nz-td [nzCheckbox]="true">
        <label nz-checkbox [nzDisabled]="data.disabled" [(ngModel)]="data.checked" (ngModelChange)="refreshStatus($event)">
        </label>
      </td>
      <td nz-td>{{data.planName}}</td>
      <td nz-td>{{data.planType | constantTransfer:trainingTypes}}</td>
      <td nz-td>{{data.planContent}}</td>
      <td nz-td>{{data.userName}}</td>
      <td nz-td>{{(data.startDate | dateFormat)}} 至 {{(data.endDate | dateFormat)}}</td>
      <td nz-td><button nz-button  [nzSize]="'small'" [nzType]="'primary'" (click)="uploadFile(data,1)">上传</button></td>
      <td nz-td><button nz-button [nzSize]="'small'" [nzType]="'primary'" (click)="uploadFile(data,2)">上传</button></td>
      <td nz-td><button nz-button  [nzSize]="'small'" [nzType]="'primary'" (click)="uploadFile(data,3)">上传</button></td>
      <td nz-td><button nz-button  [nzSize]="'small'" [nzType]="'primary'" (click)="uploadFile(data,4)">上传</button></td>
      <td nz-td><button nz-button  [nzSize]="'small'" [nzType]="'primary'" (click)="showTrainingPlanDetail(data)">查看</button></td>
    </tr>
    <tr *ngIf="dataList.length == 0 && partyType=='2'">
      <td colspan="11">测试中</td>
    </tr>
    </tbody>
  </nz-table>

  <nz-pagination [nzPageIndex]="trainingPlanBean.currentPage" nzShowTotal [nzTotal]="total" nzShowSizeChanger
                 (nzPageSizeChange)="nzPageSizeChange($event)" (nzPageIndexChange)="nzPageIndexChange($event)"
                 (nzPageIndexClickChange)="nzPageIndexClickChange($event)" [nzPageSize]="trainingPlanBean.pageSize"></nz-pagination>

  <!--添加培训材料 -->
  <!--添加培训试卷 -->
  <!--添加培训签到表 -->
  <!--考核汇总表 -->
  <nz-modal [nzVisible]="isVisible" [nzTitle]="'文件上传'" [nzOkText]="'确定'" [nzCancelText]="'取消'" [nzContent]="modalContent"
            (nzOnCancel)="isVisible=false" (nzOnOk)="isVisible=false">
    <ng-template #modalContent>
<!--
      <nz-spin [nzTip]="'正在上传请等待...'" [nzSpinning]="nzSpinning1">
-->
        <nz-upload *ngIf="uploadType==1" nzAction="{{config.IP+config.API.upload}}" nzListType="text"
                   [(nzFileList)]="materialsFileList" [nzShowButton]="true" [nzRemove]="nzRemoveFile"
                   (nzChange)="uploadChange($event)">
          <button nz-button>
            <i class="anticon anticon-upload"></i>
            <span>上传培训资料</span>
          </button>
        </nz-upload>

        <nz-upload *ngIf="uploadType==2" nzAction="{{config.IP+config.API.upload}}" nzListType="text"
                   [(nzFileList)]="checkInTableFileList" [nzShowButton]="true" [nzRemove]="nzRemoveFile"
                   (nzChange)="uploadChange($event)">
          <button nz-button>
            <i class="anticon anticon-upload"></i>
            <span>上传培训签到表</span>
          </button>
        </nz-upload>

        <nz-upload *ngIf="uploadType==3" nzAction="{{config.IP+config.API.upload}}" nzListType="text"
                 [(nzFileList)]="testPaperFileList" [nzShowButton]="true" [nzRemove]="nzRemoveFile"
                 (nzChange)="uploadChange($event)">
          <button nz-button>
            <i class="anticon anticon-upload"></i>
            <span>上传培训试卷</span>
          </button>
        </nz-upload>

      <nz-upload *ngIf="uploadType==4" nzAction="{{config.IP+config.API.upload}}" nzListType="text"
                 [(nzFileList)]="ssFileList" [nzShowButton]="true" [nzRemove]="nzRemoveFile"
                 (nzChange)="uploadChange($event)">
        <button nz-button>
          <i class="anticon anticon-upload"></i>
          <span>上传考核汇总表</span>
        </button>
      </nz-upload>


        <div style="text-align: center;margin-top: 30px;">
          <button nz-button [nzSize]="'large'" (click)="updateUpload()" [nzType]="'primary'">确定上传</button>
        </div>
<!--
      </nz-spin>
-->
    </ng-template>
  </nz-modal>

  <!--添加页面 -->
  <ng-template #title>
    <span>{{modelTitle}}</span>
  </ng-template>
  <ng-template #content>
    <trainingPlan-add-page (outValue)="addCall($event) " *ngIf="modal==0"></trainingPlan-add-page>
    <trainingPlan-update-page (outValue)="addCall($event) " *ngIf="modal==1" [inValue]="updateData"></trainingPlan-update-page>
  </ng-template>
  <ng-template #footer>
    <div>
    </div>
  </ng-template>
</div>
